import React, { useState, useEffect } from 'react';
import { List, NavBar, Icon, TextareaItem, InputItem } from 'antd-mobile';
import { R, ORDER_STATUSES } from "@/assets/js/dict"
import { detailsMsgOfParent } from "@/api/msg/msg.js";


/**
 * 家长查看消息详情
 * @param props
 * @returns {*}
 * @constructor
 */
function MessageDetailsOfParent (props) {

    let [msg_id] = useState(() => {
        if (!!props.location.state) {
            return props.location.state.msg_id;
        } else {
            return sessionStorage.getItem("msg_id");
        }
    }), [message, setMessage] = useState({});

    function getMessage () {
        detailsMsgOfParent({ msg_id: msg_id }, (res) => {
            if (R.isSuccess(res)) {
                setMessage(R.getData(res));
            }
        });
    }

    useEffect(getMessage, []);

    function back () {
        props.history.goBack();
    }

    return (
        <div className="orderDetails">
            <div className="page-title  home-tit">
                <NavBar
                    mode="light"
                    icon={<Icon type="left" />}
                    leftContent={<span key="rc"></span>}
                    onLeftClick={back}
                >
                    消息详情
                </NavBar>
            </div>
            <div className="page-content  home-content">
                <div className="publish-content-piece">
                    <div className="form-box">
                        <div className="form-con">
                            <List>
                                <InputItem
                                    type="text"
                                    editable={false}
                                    value={message.type}
                                >消息类型</InputItem>
                                <InputItem
                                    type="text"
                                    editable={false}
                                    value={message.read_time}
                                >阅读时间</InputItem>
                                <InputItem
                                    type="text"
                                    editable={false}
                                    value={message.source_display}
                                >发送者</InputItem>
                            </List>
                        </div>
                        <div className="form-tit">
                            <i className="mini-block" />
                            <strong>消息正文</strong>
                        </div>
                        <div className="form-con">
                            <List>
                                <TextareaItem
                                    editable={false}
                                    disabled
                                    value={message.content}
                                    autoHeight
                                    rows={5}
                                />
                            </List>
                        </div>
                    </div>
                </div>
            </div>
        </div>);
}

export default MessageDetailsOfParent;